<div class="bk_content_ful">
	<div class="layui-card">
		<div class="layui-tab layui-tab-brief bk_tap" lay-filter="docDemoTabBrief">
			<!-- 左侧子树 -->
			<!-- <div class=" bk-side-child" style="width: 276px;">
				<div class="layui-card bk_full has_header left_tree">
					<div class="layui-card-header">
						<div class="tree_top_ss"><input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="关键字"
							 class="layui-input">
							<i class="layui-icon search-icon"></i>
						</div>
						<h1>任免批次列表</h1>
					</div>
					<div class="bk_full">
						<div id="test1" class="demo-tree demo-tree-box"></div>
					</div>
					
				</div>
				<div class="yincang_on" id="bk_toggle">&nbsp;</div>
			</div> -->
			<!-- 右边内容区域 -->
			<div class="bk_hastap_right toggle_w">
				<div class="layui-card-header bk_header">
					<h1>任免上会管理>>上会列表</h1>
				</div>
				<div class="bk-card-body">
					
	<form class="layui-form" action="">
				<div class="layui-row bk_search_box">

					<div class="layui-col-xs4 search-input">
						<div class="layui-form-item">
							<label class="layui-form-label">状态:</label>
							<div class="layui-input-block">
								<input type="checkbox" name="" title="当前" lay-skin="primary" checked>
								<input type="checkbox" name="" title="历史" lay-skin="primary">
							</div>
						</div>
					</div>
					<div class="layui-col-xs4 search-input">
						<div class="layui-form-item">
							<label class="layui-form-label">上会序号:</label>
							<div class="layui-input-block">
								<input type="text" name="title" required lay-verify="required" placeholder="全部或部分上会序号" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					<div class="layui-col-xs4 search-input">
						<div class="layui-form-item">
							<label class="layui-form-label">会议类型:</label>
							<div class="layui-input-block">
								<select name="city" lay-verify="required">
									<option value="">请选择</option>
									<option value="0">省纪委常委会</option>
									<option value="1">省纪委组织部部务会</option>
									<option value="2">省委常委会</option>
									<option value="3">省委组织部会</option>
								</select>
							</div>
						</div>
					</div>
					<div class="layui-col-xs4 search-input">
						<div class="layui-form-item">
							<label class="layui-form-label">会议时间:</label>
							<div class="layui-input-block">
								<input type="text" class="layui-input input-date" id="startTime"> &nbsp;至 &nbsp;
								<input type="text" class="layui-input input-date" id="endTime">
							</div>
						</div>
					</div>
					<div class="layui-col-xs4 search-input">
						<div class="layui-form-item">
							<label class="layui-form-label">会议描述:</label>
							<div class="layui-input-block">
								<input type="text"  required lay-verify="required" placeholder="全部或部分会议描述" autocomplete="off" class="layui-input">
							</div>
						</div>
					</div>
					

					<div class="right_btn">
						<button type="button" class="layui-btn">查询</button>
						<button type="button" class="layui-btn layui-btn-primary resize-button">重置</button></div>
				</div>
			</form>
		
					<div class="">
						<table id="demo_hash" lay-even="" lay-filter="table_data">
						</table>
					 
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script type="text/html" id="toolbarDemo">
	<div class="layui-btn-container opertion-btnBox">
	
              
				 <a href="javascript:;" class="layui-btn layui-btn-xs  operaion-button" lay-event="add">
				  		<i class="layui-icon">&#xe669;</i> <span>刷新</span>
				 </a>
			 
				<a href="javascript:;" class="  layui-btn-xs">
				 		   本次查询人数：<span class="total-color"  >10</span>人
				</a>
			 
                 <div class="form-righttool" style="float: right">
					 <a href="javascript:;" class="layui-btn layui-btn-xs operaion-button" lay-event="meeting_detail">
					  		<i class="layui-icon">&#xe610;</i> <span>会议详情</span>
					 </a>
                  <a href="javascript:;" class="layui-btn layui-btn-xs operaion-button" lay-event="LAYTABLE_COLS">
                   		<i class="layui-icon">&#xe610;</i> <span>显示设置</span>
                  </a>
				  <a href="javascript:;" class="layui-btn layui-btn-xs operaion-button" lay-event="LAYTABLE_EXPORT">
				   		<i class="layui-icon">&#xe67d;</i> <span>导出</span>
				  </a>
                 </div>
    </div>
 </script>

<script>
	layui.config({
		base: '/src/js/'
	}).use(['jquery', 'mockjs', 'table', 'sidebar',"laydate", 'form'], function() {
		var $ = layui.jquery,
			layer = layui.layer,
			table = layui.table,
			sidebar = layui.sidebar,
			form = layui.form;
			laydate = layui.laydate;
			form.render()
			leyuiUseDate(["#startTime", "#endTime"])
		//第一个实例
	//表格渲染
		table.render({
			// size: 'sm',
			id: "input_table",
			limit: 20,
			elem: '#demo_hash',
			toolbar: "#toolbarDemo", //false
			defaultToolbar: [],
			height: 'full-252', //表格区域的高度值124
			url: 'views/pages/meeting-manage/meeting-list/list.json', //数据接口
			page: true, //开启分页
			cols: [
				[ //表头
					{
						checkbox: true,
						fixed: true,
						width: 50,
						align: "center",
					}, {
						field: 'id',
						title: '序号',
						width: 400,
						sort: true,
						align: "center"
					}, {
						field: 'meetingType',
						title: '会议类型',
						width: 200,
						sort: true,
						align: "center"
					}, {
						field: 'meetingDate',
						title: '会议时间',
						width: 200,
						align: "center"
					}, {
						field: 'meetingDescription',
						title: '会议描述',
						 
						align: "center"
					}
				]
			]
		});

		//监听工具条
		table.on('toolbar(table_data)', function(obj) {
			var checkStatus = table.checkStatus(obj.config.id);
			switch (obj.event) {
				case 'add':
					editBytton()
					break;
				case 'delete':

					break;
				case 'edit':
					editBytton()

					break;
				case 'reload':
					table.reload('input_table', {
						where: {
							username: null,
							email: null
						}
					});

					break;
			};
		});
	
	});
	 // 渲染时间组件
	 function leyuiUseDate(data) {
	 	data.forEach(function(item) {
	 		laydate.render({
	 			elem: item //指定元素
	 		});
	 	})
	 }
// 弹出编辑框
	function editBytton() {
		layer.open({
			type: 2,
			area: ['1000px', '360px'],
			maxmin: true,
			// offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
			id: "2", //防止重复弹出
			title: '人员信息编辑',
			content: "views/pages/meeting-manage/meeting-task/peopleEdit.html",
			btn: ['提交', '重置'],
			btnAlign: 'c', //按钮居中

			shade: [0.3, '#393D49'], //不显示遮罩
			yes: function() {
				layer.closeAll();
			}
		});
	}
</script>
 
<style scoped>
	.search-input{
		margin-bottom: 10px;
	}
	.right_btn {
		position: absolute;
		top: 13%;
		right: 0;
	}
	
	.right_btn button {
		display: block;
		margin-bottom: 10px;
		margin-left: 10px;
	}
</style>
